import 'package:flutter/material.dart';
import 'package:smart_shop/pages/cart/index.dart';
import 'package:smart_shop/pages/category/index.dart';
import 'package:smart_shop/pages/home/index.dart';
import 'package:smart_shop/pages/mine/index.dart';

class TabbarPage extends StatefulWidget {
  const TabbarPage({super.key});

  @override
  createState() => _TabbarPageState();
}

class _TabbarPageState extends State<TabbarPage> {
  // 定义tabList数据
  List tabList = [
    {
      'label': '首页',
      'activeIcon': 'assets/tabbar/home-active.png',
      'icon': 'assets/tabbar/home.png',
    },
    {
      'label': '分类',
      'activeIcon': 'assets/tabbar/cate-active.png',
      'icon': 'assets/tabbar/cate.png',
    },
    {
      'label': '购物车',
      'activeIcon': 'assets/tabbar/cart-active.png',
      'icon': 'assets/tabbar/cart.png',
    },
    {
      'label': '我的',
      'activeIcon': 'assets/tabbar/user-active.png',
      'icon': 'assets/tabbar/user.png',
    }
  ];
  //定义选中的索引
  int currentIndex = 0;
  // Widget _getTabBarComp() {
  //   if (currentIndex == 0) {
  //     return const Text('首页');
  //   } else if (currentIndex == 1) {
  //     return const Text('分类');
  //   } else if (currentIndex == 2) {
  //     return const Text('购物车');
  //   } else {
  //     return const Text('我的');
  //   }
  // }

  @override
  Widget build(BuildContext context) {
    //页面骨架
    return Scaffold(
      //顶部导航栏
      // appBar: AppBar(
      //   centerTitle: true,
      //   title: const Text('智慧商城'),
      //   backgroundColor: Colors.pink,
      //   foregroundColor: Colors.white,
      // ),
      //底部导航栏
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: currentIndex,
        onTap: (index) {
          setState(() {
            currentIndex = index;
          });
        },
        type: BottomNavigationBarType.fixed,
        selectedItemColor: Colors.red,
        unselectedItemColor: Colors.grey,
        items: tabList
            .map((item) => BottomNavigationBarItem(
                icon: Image.asset(
                  item['icon'],
                  width: 30,
                  height: 30,
                ),
                activeIcon: Image.asset(
                  item['activeIcon'],
                  width: 30,
                  height: 30,
                ),
                label: item['label']))
            .toList(),
      ),
      //indexedStack 索引栈
      body: IndexedStack(
        alignment: Alignment.center,
        index: currentIndex,
        children: const [HomePage(), CategoryPage(), CartPage(), MinePage()],
      ),
    );
  }
}
